<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:p="http://xmlns.jcp.org/jsf/passthrough"
      >
    <h:head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <meta charset="utf-8"/>
        <!-- Title and other stuffs -->
        <title>Registrarse</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <meta name="description" content=""/>
        <meta name="keywords" content=""/>
        <meta name="author" content=""/>

        <!-- Stylesheets -->
        <link href="../style/bootstrap.css" rel="stylesheet"/>
        <link rel="../stylesheet" href="style/font-awesome.css"/>
        <link href="../style/style.css" rel="stylesheet"/>


        <!-- HTML5 Support for IE -->
        <!--[if lt IE 9]>
        <script src="js/html5shim.js"></script>
        <![endif]-->

        <!-- Favicon -->
        <link rel="shortcut icon" href="../img/favicon/favicon.png"/>
    </h:head>

    <h:body>

        <div class="admin-form">

            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <!-- Widget starts -->
                        <div class="widget wred">
                            <div class="widget-head">
                                <i class="icon-lock"></i> Registrarse
                            </div>

                            <div class="widget-content">
                                <div class="padd" style="height: 300px;">

                                    <h:form>
                                        <!-- Registration form starts -->
                                        <!-- Name -->
                                        <div class="form-group">
                                            <label class="control-label col-lg-3" for="unombre">#{msg.nombre}</label>
                                            <div class="col-lg-9">
                                                <h:inputText id="unombre" value="#{ctrUsuario.usuario.nombre}" 
                                                             required="true" requiredMessage="#{msg.camporequerido}"
                                                             styleClass="form-control"
                                                             />
                                                <rich:message for="unombre"/>
                                            </div>

                                        </div>   
                                        <!-- Apellido -->
                                        <div class="form-group">
                                            <label class="control-label col-lg-3" for="uapellido">#{msg.apellido}</label>
                                            <div class="col-lg-9">
                                                <h:inputText id="uapellido" value="#{ctrUsuario.usuario.apellido}" 
                                                             required="true" requiredMessage="#{msg.camporequerido}"
                                                             styleClass="form-control"
                                                             />
                                                <rich:message for="uapellido"/>
                                            </div>

                                        </div>

                                        <!-- Email -->
                                        <div class="form-group">
                                            <label class="control-label col-lg-3" for="uemail">#{msg.email}</label>
                                            <div class="col-lg-9">
                                                <h:inputText id="uemail" value="#{ctrUsuario.usuario.email}" 
                                                             required="true" requiredMessage="#{msg.camporequerido}"
                                                             styleClass="form-control"
                                                             />
                                                <rich:message for="uemail"/>
                                            </div>
                                        </div>

                                        <!-- Username -->
                                        <div class="form-group">
                                            <label class="control-label col-lg-3" for="username">#{msg.usuario}</label>
                                            <div class="col-lg-9">
                                                <h:inputText id="uusername" value="#{ctrUsuario.usuario.username}" 
                                                             required="true" requiredMessage="#{msg.camporequerido}"
                                                             styleClass="form-control"
                                                             />
                                                <rich:message for="uusername"/>
                                            </div>
                                        </div>
                                        <!-- Password -->
                                        <div class="form-group">
                                            <label class="control-label col-lg-3" for="upassword">#{msg.password}</label>
                                            <div class="col-lg-9">
                                                <h:inputSecret id="upassword" value="#{ctrUsuario.usuario.password}" 
                                                               required="true" requiredMessage="#{msg.camporequerido}"
                                                               styleClass="form-control"
                                                               />
                                                <rich:message for="upassword"/>
                                            </div>
                                        </div>

                                        <!-- RePassword -->
                                        <div class="form-group">
                                            <label class="control-label col-lg-3" for="urepassword">#{msg.repassword}</label>
                                            <div class="col-lg-9">
                                                <h:inputSecret id="urepassword" value="#{ctrUsuario.usuario.repassword}" 
                                                               required="true" requiredMessage="#{msg.camporequerido}"
                                                               styleClass="form-control"
                                                               />
                                                <rich:message for="urepassword"/>
                                            </div>
                                        </div>


                                        <!-- Accept box and button s-->
                                        <div class="form-group">
                                            <div class="col-lg-9 col-lg-offset-3">
                                                <div class="checkbox">
                                                    <label>
                                                        <h:selectBooleanCheckbox id="uterminos" required="true" value="#{ctrUsuario.usuario.terminosCondiciones}"/>
                                                        Acepta los terminos y Condiciones.
                                                    </label>
                                                </div>
                                                <rich:message for="uterminos"/>
                                                <br />
                                                <rich:messages />
                                                <br />
                                                <h:commandButton  p:type="submit" class="btn btn-danger" value="Registrarse"  action="#{ctrUsuario.grabar(1,'registerConfirmation')}"/> 
                                                <h:commandButton  p:type="submit" class="btn btn-default" value="Reset" action="#{ctrUsuario.resetearCamposRegister()}" immediate="true"  />

                                            </div>
                                        </div>
                                        <br />
                                    </h:form>

                                </div>
                            </div>

                            <div class="widget-foot">
                                Ya estas Registrado? <a href="../pub/index.xhtml">Login</a>
                            </div>
                        </div>  
                    </div>
                </div>
            </div> 

        </div>



        <!-- JS -->
        <script src="../js/jquery.js"></script>
        <script src="../js/bootstrap.js"></script>
    </h:body>
</html>